<template> 
<div id="main">
    
    <div id="inp">
      
       
        <input class="inp1" v-model="userName" type="text" placeholder="账号" >
        <input  class="inp1" v-model="passWord" type="text" placeholder="密码" >
         <van-checkbox class="checkb" v-model="agree" checked-color="#bule">同意《xxx协议》？</van-checkbox>
        <button class="loginBtn" @click="registerEvt"   :disabled="!agree">注册</button> <br> 
        <span class="link rgt" @click="$router.push('/login')">已有账号去登录</span><br>
    </div></div>
</template>
<script>
import MockService from '../../apis/Ajax'

export default {
    data() {
        return {
            agree:false,
            userName:'',
            passWord:'',
        }
    },
    methods: {
        async registerEvt(){
            let result= await MockService.registerUser(this.userName,this.passWord)
        //   this.$store.commit('common/setToken',obj)
            console.log(result);
            this.$router.push('/login')
        },
    },
}
</script>
<style lang="less" scoped>
 
        #main{
             display: block;
        position: relative;
        height: 100%;
        padding: 4vh 20px 0;
        background-color: #c8c8c8;
             #inp{
              margin:auto;
              margin-top: 100px;
            //   margin-left: 36px;
              width: 370px;
              height: 260px;
         
              > .inp1{
                  height: 30px;
                  width: 300px;
                 margin: 13px;
                 margin-left: 46px;
                 text-indent: 1em;
                 background-color: #c8c8c8;
                //  border-radius: 10px;
                border-left: none;
                border-top: none;
                border-right: none;
                border-bottom: 1px solid #999999;
              
            .checkb{
             margin-left: 60px;
             margin-top: 5px;
            }  
          }
          .loginBtn{
               height: 45px;
                  width: 270px;
               margin: 13px;
               margin-left: 60px;
                
                background: #5e5cff;
                border-radius: 20px;
                font-size: 20px;
          }
          .rgt{
              margin-left: 250px;
          }
      
      }
        }
</style>